<template>
	<section style="width:100%">
		<section>
			<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
				<el-form :inline="true">
					<el-form-item>
						<el-input v-model="userId" placeholder="玩家ID"></el-input>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" v-on:click="getUsers(pageSize)">查询</el-button>
					</el-form-item>
					<el-form-item label="刷新" style="margin-left: 50px">
						<el-radio-group v-model="autoBreak" @change="changeBreak">
							<el-radio :label="5000">5秒</el-radio>
							<el-radio :label="15000">15秒</el-radio>
							<el-radio :label="300000">30秒</el-radio>
							<el-radio :label="0">停止</el-radio>
						</el-radio-group>
					</el-form-item>
				</el-form>
			</el-col>
			<!--列表-->
			<el-table :data="users" stripe highlight-current-row v-loading="listLoading"  style="width: 100%;" :default-sort = "{prop: 'time', order: 'descending'}">
				<el-table-column prop="id" label="单号">
				</el-table-column>
				<el-table-column prop="userid" label="代理ID" sortable width="120">
				</el-table-column>
				<el-table-column prop="nickname" label="代理昵称" width="120">
				</el-table-column>
				<el-table-column prop="amount" label="提现金额" width="120" sortable>
				</el-table-column>
				<el-table-column prop="account" label="到账账号" width="200">
				</el-table-column>
				<el-table-column prop="createtime" label="申请时间" width="200" sortable>
				</el-table-column>
				<el-table-column prop="finishtime" label="处理时间" width="200">
				</el-table-column>
				<el-table-column prop="orderno" label="订单号" width="250">
				</el-table-column>
				<el-table-column prop="extroinfo" label="提现信息" min-width="250">
				</el-table-column>
				<el-table-column prop="issue" label="客户反馈" width="120">
				</el-table-column>
				<el-table-column prop="remark" label="备注" width="150">
				</el-table-column>
				<el-table-column prop="stateTxt" label="处理状态" width="100" >
				</el-table-column>
				<!--<el-table-column prop="cardName" label="到账账号" width="100" >-->
				<!--</el-table-column>-->
				<!--<el-table-column prop="bankName" label="到账银行" width="100" >-->
				<!--</el-table-column>-->
				<!--<el-table-column prop="cardNumber" label="到账银行账号" width="150">-->
				<!--</el-table-column>-->
				<el-table-column label="操作" min-width="280">
					<template slot-scope="scope" v-if="scope.row.status == 2">
						<!--<el-button type="primary" size="small" >处理完成</el-button>-->
						<el-button type="success" size="small" @click="editCash(scope.row.id,'10')">成功</el-button>
						<el-button type="danger" size="small" @click="editCash(scope.row.id,'-1')">拒绝</el-button>
					</template>
				</el-table-column>
			</el-table>
			<!--工具条-->
			<el-col :span="24" class="toolbar">
				<el-pagination layout="sizes, total, prev, pager, next" :page-sizes="[15, 30, 50]" @current-change="handleCurrentChange" @size-change="handleSizeChange"  :page-size="pageSize" :total="total" style="float:right;">
				</el-pagination>
			</el-col>

			<!--操作弹窗-->
			<el-dialog title="操作反馈" :visible.sync="remarkVisible">
				<el-form label-width="100px">
					<el-form-item label="备注">
						<el-input type="textarea" placeholder="备注" :rows="3" v-model="remark"></el-input>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="remarkVisible = false">取 消</el-button>
					<el-button type="primary" @click="remarkSubmit">确 定</el-button>
				</div>
			</el-dialog>

		</section>
	</section>
</template>

<script>
	import base64 from '../../api/base64'
    import ElInput from "element-ui/packages/input/src/input";
	export default {
        components: {ElInput},
        data() {
			return {
                userId:'',
				remarkId:'',
				remark:'',
				remarkState:'',
                listLoading:false,
                remarkVisible:false,
                users:[],
                total:0,
                autoBreak:5000,
                page:1,
				pageSize:15
			}
		},
        // created(){
        //     let agentId = sessionStorage.getItem('searchAgentId')
        //     if (agentId){
        //         this.userId = agentId
        //         sessionStorage.removeItem('searchAgentId')
        //     }
        // },
		methods: {
            changeBreak(val){
                window.clearInterval(window.timer)
                if(val != 0){
                    window.timer = window.setInterval(()=>{
                        this.getUsers(this.pageSize);
                    },val)
                }
            },
            handleSizeChange(val) {
                this.pageSize = val
                this.getUsers(this.pageSize);
            },
			handleCurrentChange(val) {
				this.page = val;
				this.getUsers(this.pageSize);
			},
			//获取用户列表
			getUsers(page) {
                this.listLoading = true;
                this.$axios.get('/agent-withdrawls?userid='+this.userId+'&index='+this.page+'&size='+page,{},this.global().token).then((res)=>{
                    if (res.status == 200){
                        this.total = res.data.count
                        let userTable = res.data.data
                        let base = new base64.Base64()
                        userTable.forEach((val)=>{
                            if (val.nickname){
                                val.nickname =  base.decode(val.nickname)
							}
                            val.createtime = this.changeDate(val.createtime)
							if (!(val.transferat || val.transferat == '0')){
                                val.finishtime = this.changeDate(val.finishtime)
							}else{
                                val.finishtime = ''
							}
                            val.stateTxt = val.status.toString().replace('10','已完成').replace('2','处理中').replace('-1','失败')
                        })
                        this.users = userTable
                        this.listLoading = false
                    }else{
                        this.$message({message: res.data, type: 'error'});
                        this.listLoading = false
                    }
                })
			},
            editCash(id,state){
                this.remarkId = id;
                this.remarkState = state;
                this.remarkVisible = true
			},
            remarkSubmit(){
                this.$axios.patch('/agent-withdrawl/'+this.remarkId,{status:parseInt(this.remarkState),remark:this.remark},this.global().token).then((res)=>{
                    if (res.status == 200){
                        this.$message({message: '操作成功', type: 'success'});
                        this.getUsers(this.pageSize)
                        this.remarkVisible = false
                    }else{
                        this.$message({message: res.data, type: 'error'});
                    }
                })
			}
		},
		created() {
			this.getUsers(this.pageSize);
            window.timer = window.setInterval(()=>{
                this.getUsers(this.pageSize);
            },this.autoBreak)
		}
	}

</script>

<style scoped lang="stylus">
	.agent-path
		display flex
		padding-bottom 10px
		&>p
			padding-right 10px
		&>h3
			cursor pointer
</style>